"use strict";
// IMPORTS
// STYLES
// COMPONENTS
// EXPORTS

////////////////////////////////////////////////////////////////////////////////
// IMPORTS

import React, {
    Component,
} from 'react';

import {
    StyleSheet,
    Text,
    View
} from 'react-native';


////////////////////////////////////////////////////////////////////////////////
// STYLES

var styles = StyleSheet.create({
    center_items: {
        flexDirection: 'row', 
        height: 36, 
        backgroundColor: '#113845', 
        justifyContent: 'center', 
        alignItems: 'center'
    },
    header_text: {
        flex:1,  
        color: '#ffffff', 
        textAlign:'center', 
        fontWeight:'bold', 
        marginTop: 2
    },
    button: {
        backgroundColor: 'white',
        padding: 15,
        borderBottomWidth: StyleSheet.hairlineWidth,
        borderBottomColor: '#CDCDCD',
    }
});

////////////////////////////////////////////////////////////////////////////////
// COMPONENTS

class TopBar extends React.Component {
    
    constructor(props) {
        
        super(props);
        
        if (props.text) {
            this.headerText = props.text;
        } else {
            this.headerText = "N/A";
        }
        
    }
    
    render() {
        return (
            <View style={ styles.center_items }>
                <Text style={ styles.header_text }>{this.headerText}</Text>
            </View>
        );
    }
}

////////////////////////////////////////////////////////////////////////////////
// EXPORTS

module.exports = TopBar;